<template>
  <el-upload
    class="upload-demo"
    ref="upload"
    action="https://jsonplaceholder.typicode.com/posts/"
    :on-preview="handlePreview"
    :on-remove="handleRemove"
    :show-file-list="false"
    :file-list="fileList"
    :on-change="filechange"
    :auto-upload="false">
    <el-button slot="trigger" size="small" type="primary">上传JOSN文件</el-button>
  </el-upload>
</template>


<script>
  import { timeSleep } from '@/utils/functions'
  export default {
    data() {
      return {
        fileList: []
      };
    },
    methods: {
      submitUpload() {
        this.$refs.upload.submit();
      },
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePreview(file) {
        console.log(file);
      },
      filechange({name,raw:file}) {
        console.log(name,file)
        this.$confirm(`上传比赛数据文件\n${name}, 是否继续?`, '上传', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          await timeSleep(1000)
          this.$message({
            type: 'error',
            message: '解析失败'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消'
          })
        })
      }
    }
  }
</script>